<template>
    <view class="container purchase-detial paddingBottomBar" v-if="data">
        <header-bar :config="config"></header-bar>
        <view class="detial-item-house" @click="selectWarehouse()">
            <text class="label">入库仓库</text>
            <text class="value">{{ addParam.WarehouseName ? addParam.WarehouseName : "默认仓库" }}</text>
            <uni-icons type="arrowright"></uni-icons>
        </view>
        <view class="detail-card">
            <view class="detial-title">
                <text>物流信息</text>
            </view>
            <view class="detail-info">
                <easy-label-value
                    label="配送方式:"
                    :value="
                        data.BuyModel.Address && data.BuyModel.Address.ExpressName
                            ? data.BuyModel.Address.ExpressName
                            : ''
                    "></easy-label-value>
                <easy-label-value
                    label="物流单号:"
                    :value="
                        data.BuyModel.Address && data.BuyModel.Address.ExpressNo ? data.BuyModel.Address.ExpressNo : ''
                    "></easy-label-value>
            </view>
        </view>
        <view class="detail-card">
            <view class="detial-title">
                <text>商品清单</text>
            </view>
            <view class="detail-info noPb">
                <purchase-pro-item
                    v-for="(item, index) in data.OutModel.SkuList"
                    :key="index"
                    :item="item"></purchase-pro-item>
            </view>
        </view>
        <view class="detail-card mb20">
            <view class="detial-title">
                <text>订单信息</text>
            </view>
            <view class="detail-info">
                <easy-label-value label="入库单号:" :value="data.OutModel.StockOutSn"></easy-label-value>
                <easy-label-value label="采购单号:" :value="data.BuyModel.OrderNo"></easy-label-value>
                <easy-label-value label="采购时间:" :value="data.BuyModel.AddTime"></easy-label-value>
                <easy-label-value label="发货时间:" :value="data.OutModel.StockOutTime"></easy-label-value>
                <easy-label-value
                    label="供应商:"
                    :value="
                        data.BuyModel.SupplierModel && data.BuyModel.SupplierModel.FactoryName
                            ? data.BuyModel.SupplierModel.FactoryName
                            : ''
                    "></easy-label-value>
                <easy-label-value
                    label="寄件人:"
                    :value="
                        data.BuyModel.SupplierModel && data.BuyModel.SupplierModel.ContactName
                            ? data.BuyModel.SupplierModel.ContactName
                            : ''
                    "></easy-label-value>
                <easy-label-value
                    label="寄件地址:"
                    :value="getAddressText(data.BuyModel.SupplierModel)"></easy-label-value>
            </view>
        </view>
        <view class="bottom-bar">
            <button class="btn btn-main flex-fill" @click="sureInFn">确认入库</button>
        </view>
    </view>
</template>

<script>
import easyCellItem from "@/components/easy/easy-cell-item.vue"
import easyLabelValue from "@/components/easy/easy-label-value.vue"
import purchaseProItem from "@/pages_work/components/purchase/purchase-pro-item.vue"
import { BuyOrderStockOutToIn } from "@/service/api/buyOrder.js"
export default {
    components: {
        easyCellItem,
        easyLabelValue,
        purchaseProItem,
    },
    data() {
        return {
            config: {
                title: "入库确认",
                centerSlot: true,
                color: ["#ffffff"],
                statusBarFontColor: "#ffffff",
            },
            isWait: false,
            id: 0,
            addParam: {},
            data: null,
        }
    },
    created() {
        let mainColor = this.easyGetColor("main")
        this.config.backgroundColor = [1, mainColor]
    },
    mounted() {},
    onLoad(e) {
        if (e.data) {
            this.data = JSON.parse(decodeURIComponent(e.data))
        }
    },
    methods: {
        selectWarehouse() {
            uni.navigateTo({
                url: "/pages/select/select-warehouse?from=1",
                events: {
                    getSelectData: (data) => {
                        this.addParam.WarehouseId = data.WarehouseId
                        this.addParam.WarehouseName = data.WarehouseName
                        this.$forceUpdate()
                    },
                },
            })
        },
        getAddressText(data) {
            if (!data) {
                return ""
            }
            let ProvinceName = data.ProvinceName ? data.ProvinceName : ""
            let CityName = data.CityName ? data.CityName : ""
            let AreaName = data.AreaName ? data.AreaName : ""
            let StreetName = data.StreetName ? data.StreetName : ""
            let ContactAddress = data.ContactAddress ? data.ContactAddress : ""
            return `${ProvinceName}${CityName}${AreaName}${StreetName}${ContactAddress}`
        },
        sureInFn() {
            let param = this.data
            let path = ""
            if (this.addParam.WarehouseId) {
                param.AddressId = this.addParam.WarehouseId
                path = "?AddressId=" + this.addParam.WarehouseId
            }

            BuyOrderStockOutToIn(param, path).then((res) => {
                if (res.State == 1) {
                    this.easyToast("入库成功")
                    setTimeout((e) => {
                        this.easyGoBack(2)
                    }, 500)
                } else {
                    this.easyToast(res.Msg)
                }
            })
        },
    },
}
</script>

<style lang="scss" scoped>
.detial-item-house {
    display: flex;
    flex-direction: row;
    padding: $app-page-padding;
    margin: $app-page-padding;
    background: $color-white;
    border-radius: 8rpx;
    height: 50rpx;
    align-items: center;
    .label {
        font-size: $font-size-28;
        font-weight: bold;
        margin-right: 70rpx;
    }
    .value {
        flex: 1;
    }
}
.bottom-bar {
    .btn {
        height: 90rpx;
        border-radius: 100rpx;
        font-size: $font-size-32;
    }
}
</style>
